import React, { Component } from "react";
import {
  Form,
  Input,
  Button,
  Radio,
  Select,
  Cascader,
  DatePicker,
  InputNumber,
  TreeSelect,
  Switch,
  message,
} from "antd";
import { http } from "../../api/index";

const { TextArea } = Input;
export default class AnnonceCpt extends Component {
  state = {
    componentSize: "default",
  };

  addFinish = (value) => {
    // console.log(value);
    http
      .addAnnounces({
        phone: localStorage.phone,
        title: value.title,
        type: value.type,
        startTime: value.times[0]._d,
        endTime: value.times[1]._d,
        content: value.content,
        isAnnon: value.isAnnon,
      })
      .then((res) => {
        if (res.data.code == 200) {
          this.addform.resetFields();
          this.props.history.push("/main/announc/list");
        }
      });
  };
  onFinishFailed = () => {
    message.error("请先填写信息再添加");
  };
  render() {
    const { componentSize } = this.state;
    return (
      <div>
        <h2>发布公告</h2>
        <Form
          labelCol={{
            span: 4,
          }}
          wrapperCol={{
            span: 14,
          }}
          layout="horizontal"
          initialValues={{
            size: componentSize,
          }}
          ref={(el) => (this.addform = el)}
          onFinish={this.addFinish}
          onFinishFailed={this.onFinishFailed}
          size={componentSize}
        >
          <Form.Item label="标题" name="title">
            <Input />
          </Form.Item>

          <Form.Item label="公告类型" name="type">
            <TreeSelect
              treeData={[
                {
                  title: "紧急公告",
                  value: "紧急公告",
                },
                {
                  title: "重要公告",
                  value: "重要公告",
                },
                {
                  title: "普通公告",
                  value: "普通公告",
                },
              ]}
            />
          </Form.Item>
          <Form.Item label="起始时间" name="times">
            <DatePicker.RangePicker style={{ width: "70%" }} />
          </Form.Item>

          <Form.Item label="公告内容" name="content">
            <TextArea showCount maxLength={150} />
          </Form.Item>
          <Form.Item label="仅通知管理员" name="isAnnon">
            <Switch />
          </Form.Item>
          <Form.Item label="确认提交">
            <Button type="danger" htmlType="submit">
              提交
            </Button>
          </Form.Item>
        </Form>
      </div>
    );
  }
}
